<template>
  <div class="crud-table-data">
    <el-table v-bind="$attrs" v-on="$listeners" :data="list" v-loading="isloading" border stripe height="100%">
      <slot />
      <template #empty>
        <el-empty v-show="list.length === 0 && !isloading">
          <el-button plain type="primary" @click="getTableDatas">刷新</el-button>
        </el-empty>
      </template>
    </el-table>
  </div>
</template>

<script>


export default {
  name: 'crud-table-data',
  props: {
    autoLoad: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {

    }
  },
  computed: {
    list() {
      return this.tableData()
    },
    isloading() {
      return this.isLoading()
    }
  },
  inject: {
    getTableDatas: { default: () => () => {} },
    tableData: { default: () => () => [] },
    isLoading: { default: () => () => false },
    // enablePagination: { default: () => () => false },
    // currentPage: { default: () => () => 1 },
    // defaultPageSize: { default: () => () => 15 },
    // setTotal: { default: () => () => { } },
    // setCurrentPage: { default: () => () => { } },
  },
  created() {
    if(this.autoLoad) this.getTableDatas(true, this.params)
  },
  methods: {


  },
}
</script>

<style>
  .crud-table-data {
    flex: 1;
    position: relative;
  }
  .crud-table-data ::v-deep .el-table{
    position: absolute;
  }
</style>